
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="ntModalLabel" type="{$request|default=''}">{$title}</h4>
    </div>
    <div id="mainsss">
    <div class="modal-body" >
        <div class="row clearfix">
                <div class="col-md-12 column">
                    <div class="alert alert-dismissable alert-info">
                    <button type="button" class="close">×</button>
                    <p></p>
                    </div>
                </div>
        </div>
        <div class="row">
            <div class="col-md-7">
                    <ul class="nav nav-tabs" role="tablist">
                        <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">{:lang('Chinese')}</a></li>
                        <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">{:lang('English')}</a></li>
                        <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">{:lang('Portuguese')}</a></li>
                    </ul>
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane active" id="home">
                            <table class="table table-hover ntTable" style="padding-top:0">
                                <tbody>
                                    <tr>
                                        <td>{:lang('type_name')}<span class="required"></span></td>
                                        <td><input type="text" class="form-control proname" placeholder="{:lang('product_introduction_type')}" value="{if isset($editData)}{$editData.name_zh}{/if}"></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="profile">
                            <table class="table table-hover ntTable" style="padding-top:0">
                                <tbody>
                                    <tr>
                                        <td>{:lang('type_name')}<span class="required"></span></td>
                                        <td><input type="text" class="form-control proname" placeholder="{:lang('product_introduction_type')}" value="{if isset($editData)}{$editData.name_en}{/if}"></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="messages">
                            <table class="table table-hover ntTable" style="padding-top:0">
                                <tbody>
                                    <tr>
                                        <td>{:lang('type_name')}<span class="required"></span></td>
                                        <td><input type="text" class="form-control proname" placeholder="{:lang('product_introduction_type')}" value="{if isset($editData)}{$editData.name_pt}{/if}"></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                <table class="table table-striped table-hover ntTable" style="padding-top:0;margin-top: -20px;">
                    <tbody>
                        <tr>
                            <td>指定语言<span class="required"></span></td>
                            <td>
                                {volist name="$language" id="vo"}
                                    <div class="checkbox">
                                        <label><input type="checkbox" value="{$vo.code}" {if isset($editData)}{if in_array($vo.code,$lang_ids)}checked{/if}{/if} >{$vo.name}</label>
                                    </div>
                                {/volist}
                            </td>
                        </tr>
                        <tr>
                            <td>审核发布<span class="required"></span></td>
                            <td>
                                <label class="Checkbox-inline">
                                    <input type="checkbox" class="is_audit" name="optionsCheckboxinline" value="verify" {if isset($editData)}{if $editData.verify == 1}checked{/if}{/if}> 内容需要审核，否则保存为草稿
                                </label>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            
            <div class="col-md-5 rootlist">
                    <div>
                        <ul class="nav nav-tabs">
                            <li class="active">
                                <a href="#allcountry" data-toggle="tab" @click="changecountry('0')">{:lang('global')}</a>
                            </li>
                            <li>
                                <a href="#zhcountry" data-toggle="tab" @click="changecountry('2')">{:lang('CHINA')}</a>
                            </li>
                            <li>
                                <a href="#bacountry" data-toggle="tab" @click="changecountry('1')">{:lang('BRASIL')}</a>
                            </li>
                        </ul>
                        <div class="cat_panel" >
                                {eq name="$Think.session.admin.position_id" value="1"}
                                <!--管理员出现三个国家-->
                                <div class="tab-content">
                                    <div role="tabpanel" class="tab-pane active" id="allcountry">
                                        <div class="row clearfix">
                                            <div class="col-md-12">
                                                <div class="cat_panel">
                                                    <table>
                                                        <thead>
                                                        <tr>
                                                            <td colspan="2">{:lang('job_authorized')}</td>
                                                        </tr>
                                                        </thead>
                                                    </table>
                                                    <div style="max-height: 40vh;overflow: auto;">
                                                        <table v-cloak>
                                                            <tbody>
                                                            <tr v-for="(item,index) in positions[0]">
                                                                <td><label style="font-weight: normal;width: 100%;">
                                                                    <input class="cheitem" style="margin-right: 100px;" type="checkbox" v-model="data.checkall" :value="item.id"><template v-for="(item,index) in item.level">&nbsp;&nbsp;&nbsp;&nbsp;</template>{{item.langname}}</label>
                                                                </td>
                                                            </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div role="tabpanel" class="tab-pane" id="zhcountry">
                                        <div class="row clearfix">
                                            <div class="col-md-12">
                                                <div class="cat_panel">
                                                    <table>
                                                        <thead>
                                                        <tr>
                                                            <td colspan="2">{:lang('job_authorized')}</td>
                                                        </tr>
                                                        </thead>
                                                    </table>
                                                    <div style="max-height: 40vh;overflow: auto;">
                                                        <table v-cloak>
                                                            <tbody>
                                                            <tr v-for="(item,index) in positions[2]">
                                                                <td><label style="font-weight: normal;width: 100%;">
                                                                    <input class="cheitem" style="margin-right: 100px;" type="checkbox" v-model="data.checkall" :value="item.id"><template v-for="(item,index) in item.level">&nbsp;&nbsp;&nbsp;&nbsp;</template>{{item.langname}}</label>
                                                                </td>
                                                            </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div role="tabpanel" class="tab-pane" id="bacountry">
                                        <div class="row clearfix">
                                            <div class="col-md-12">
                                                <div class="cat_panel">
                                                    <table>
                                                        <thead>
                                                        <tr>
                                                            <td colspan="2">{:lang('job_authorized')}</td>
                                                        </tr>
                                                        </thead>
                                                    </table>
                                                    <div style="max-height: 40vh;overflow: auto;">
                                                        <table v-cloak>
                                                            <tbody>
                                                            <tr v-for="(item,index) in positions[1]">
                                                                <td><label style="font-weight: normal;width: 100%;">
                                                                    <input class="cheitem" style="margin-right: 100px;" type="checkbox" v-model="data.checkall" :value="item.id"><template v-for="(item,index) in item.level">&nbsp;&nbsp;&nbsp;&nbsp;</template>{{item.langname}}</label>
                                                                </td>
                                                            </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {/eq}
                                {neq name="$Think.session.admin.position_id" value="1"}
                                <!--不是{:lang('global')}管理员,只展示自己部门下的职位-->
                                <div class="row clearfix">
                                    <div class="col-md-11">
                                        <div class="cat_panel">
                                            <table>
                                                <thead>
                                                <tr>
                                                    <td colspan="2">{:lang('job_authorized')}</td>
                                                </tr>
                                                </thead>
                                            </table>
                                            <div style="max-height: 40vh;overflow: auto;">
                                                <table v-cloak>
                                                    <tbody>
                                                    <tr v-for="(item,index) in positions">
                                                        <td><label style="font-weight: normal;width: 100%;">
                                                            <input class="cheitem" style="margin-right: 100px;" type="checkbox" v-model="data.checkall" :value="item.id"><template v-for="(item,index) in item.level">&nbsp;&nbsp;&nbsp;&nbsp;</template>{{item.langname}}</label>
                                                        </td>
                                                    </tr>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {/neq}
                        </div>
                    </div>
                
            </div>
            <input type="hidden" id="update_id" value="{if isset($id)}{$id}{/if}">
        </div>

    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span>{:lang('cancel')}</button>
        <button type="button" class="btn btn-primary" style="padding-left:24px;padding-right:24px" @click="saveFun()"><span class="glyphicon glyphicon-floppy-disk"></span>{:lang('save')}</button>
    </div>
    </div>
    <script>
        $('.savebtns').click(function(){
            if($('#ntModalLabel').html() == "添加新产品介绍类型"){
                var url = '/admin/product/detailtypeAdd?request=insert';
            }else{
                var url = '/admin/product/detailtypeEdit?request=update';
            }

            var data={
                proname:{
                    zh:$('.proname').eq(0).val(),
                    en:$('.proname').eq(1).val(),
                    pt:$('.proname').eq(2).val()
                },
                lang:[],
                is_audit:$('.is_audit').prop('checked'),
                rootarr:[],
                id:$('#update_id').val()
            }
            
            $('.checkbox input').filter(function(index,item){
                    if($(item).prop('checked')){
                        //console.log(item.value)
                        data.lang.push(item.value)
                    }
                })
            $('.rootlist input').filter(function(index,item){
                if($(item).prop('checked')){
                    //console.log(item.value)
                    data.rootarr.push(item.value)
                }
            })
            $.ajax({
                url:url,
                type:'post',
                data,
                success:function(data){
                    data = JSON.parse(data)
                    if(data.status==1){
                        change_mes_type('.alert',data.status)
                        $('.alert').show()
                        $('.alert p').html('*'+data.msg+'<br>')
                        $('#detailtype_editModal').modal('hide')
                    }else{
                        change_mes_type('.modal-body .alert',data.status)
                        $('.modal-body .alert').show()
                        $('.modal-body .alert p').html('*'+data.msg+'<br>')
                    }
                }
            })

        });

    var v=new Vue({
        el: '#mainsss',
        data: () => ({
            lang: 'zh',//语言
            iftijiao: true,
            positions: [[],[],[]],//职位
            country_id: 0,
            data: {
                checkall: [],
                position: '',
            }
        }),
        methods: {
            //获取对应国家职位
            getdata(){
                $.ajax({
                    url: '/admin/api/postionfrmaes',
                    data: {
                        country_id: this.country_id,
                        table: 'position',
                        lang: this.lang
                    },
                    type: 'post',
                    dataType: 'json',
                    success: (data) => {
                        // data = JSON.parse(data)
                        this.positions[this.country_id].splice(0)
                        data.forEach(element => {
                            this.positions[this.country_id].push(element)
                        });
                        console.log(this.positions)
                    }
                })
            },
            geteditdata(){
                //获取国家，编辑，添加的数据
                $.ajax({
                    url: '/admin/product/detailtypeEdit?request=edit',
                    data: {id: $('#update_id').val()},
                    type: 'post',
                    dataType: 'json',
                    success: (data) => {
                        data = JSON.parse(data)
                        if (!data.country_id) {
                            //{:lang('global')}管理员，授权职位默认展示
                            this.country_id = '0';
                        } else {
                            //非{:lang('global')}管理员 默认展示
                            this.country_id = data.country_id;
                        }
                        this.getdata();//展示国家下的职务
                        if (data.position_ids) {
                            this.data.checkall = data.position_ids;//职位ids
                        }
                    }
                })
            },
            //改变国家获取对应职位
            changecountry(country_id){
                this.country_id = country_id
                console.log(this.country_id)
                this.getdata();
            },
            //改变语言
            changelang(lang){
                this.lang = lang;
                this.getdata();
            },
            saveFun(){
                if($('#ntModalLabel').attr('type') == "add"){
                    var url = '/admin/product/detailtypeAdd?request=insert';
                }else{
                    var url = '/admin/product/detailtypeEdit?request=update';
                }

                var data={
                    proname:{
                        zh:$('.proname').eq(0).val(),
                        en:$('.proname').eq(1).val(),
                        pt:$('.proname').eq(2).val()
                    },
                    lang:[],
                    is_audit:$('.is_audit').prop('checked'),
                    rootarr:this.data.checkall,
                    id:$('#update_id').val()
                }
                
                $('.checkbox input').filter(function(index,item){
                    if($(item).prop('checked')){
                        data.lang.push(item.value)
                    }
                })
                $.ajax({
                    url:url,
                    type:'post',
                    data,
                    success:function(data){
                        data = JSON.parse(data)
                        if(data.status==1){
                            change_mes_type('.alert',data.status)
                            $('.alert').show()
                            $('.alert p').html('*'+data.msg+'<br>')
                            $('#detailtype_editModal').modal('hide')
                        }else{
                            change_mes_type('.modal-body .alert',data.status)
                            $('.modal-body .alert').show()
                            $('.modal-body .alert p').html('*'+data.msg+'<br>')
                        }
                    }
                })
            }
        },
        mounted(){
            if($('#ntModalLabel').attr('type') == 'edit'){
                this.geteditdata()
            }else{
                this.getdata()
            }
            
        }
    })

    </script>